<template>
	<v-content ref="content" class="content">
		<v-header title="关于我们" back></v-header>
		<div class="companyName">
			<image src="/static/image/mine/avatar.png" class="img" mode="aspectFill"></image>
			<div class="text">华创数字云</div>
			<div class="text">版本{{ version.version }}</div>
		</div>
		<div class="list">
			<div class="item">
				<span>版本更新</span>
				<!-- <span class="text">{{ version.title }}</span> -->
				<span class="text">已是最新版本</span>
				<!-- <uni-icons type="forward" size="30" class="icons"></uni-icons> -->
			</div>
			<div class="item">
				<span>客服电话</span>
				<span class="text">{{ serviceTel }}</span>
				<!-- <uni-icons type="forward" size="30" class="icons"></uni-icons> -->
			</div>
			<div class="item">
				<span>官方邮件</span>
				<span class="text">{{ officialMail }}</span>
				<!-- <uni-icons type="forward" size="30" class="icons"></uni-icons> -->
			</div>
			<div class="item">
				<span>商务合作</span>
				<span class="text">{{ businessCooperation }}</span>
				<!-- <uni-icons type="forward" size="30" class="icons"></uni-icons> -->
			</div>
		</div>
		<div class="footer">
			<!-- <div class="foot-text">华创数字云</div> -->
			<div class="foot-text">
				<span @click="changeAgreement(0)">用户服务协议</span>
				和
				<span @click="changeAgreement(1)">隐私政策</span>
			</div>
		</div>
	</v-content>
</template>

<script>
import mixins from "@/mixins"
export default {
	mixins: [mixins],
	data() {
		return {
			businessCooperation: "",
			serviceTel: "",
			officialMail: "",
			version: {},
		}
	},

	components: {},

	computed: {},

	methods: {
		init() {
			this.getBusiness()
			this.getServiceTel()
			this.getOfficialMail()
			this.getNewVersion()
		},
		// 商务合作
		async getBusiness() {
			const res = await this.$axios.get("/api/system/configParams/getParam", {
				paramType: "2",
				paramCode: "businessCooperation",
			})
			this.businessCooperation = res.paramValue
		},
		// 客服电话
		async getServiceTel() {
			const res = await this.$axios.get("/api/system/configParams/getParam", {
				paramType: "2",
				paramCode: "serviceTel",
			})
			this.serviceTel = res.paramValue
		},
		// 官方邮件
		async getOfficialMail() {
			const res = await this.$axios.get("/api/system/configParams/getParam", {
				paramType: "2",
				paramCode: "officialMail",
			})
			this.officialMail = res.paramValue
		},
		// 版本更新
		async getNewVersion() {
			const res = await this.$axios.get("/api/system/castleVersion/newVersion")
			this.version = res
		},
		async changeAgreement(type) {
			this.toPage("/pages/mine/agreement", { type: type })
		},
	},
}
</script>
<style lang="scss" scoped>
.content {
	position: relative;
}
.companyName {
	padding: 100rpx 0;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	.img {
		border-radius: 20rpx;
		width: 256rpx;
		height: 146rpx;
		margin-bottom: 20rpx;
	}
	.text {
		margin-bottom: 20rpx;
		font-size: 34rpx;
		&:last-child {
			font-size: 28rpx;
		}
	}
}
.list {
	.item {
		background-color: #fff;
		display: flex;
		align-items: center;
		justify-content: start;
		padding: 35rpx 0;
		margin: 0 60rpx;
		border-top: 1px solid #f1f1f1;

		.icons {
			font-size: 40rpx !important;
			color: #c8c8c8 !important;
		}
		.text {
			margin-left: auto;
			color: #999;
			margin-right: 10rpx;
			font-size: 26rpx;
		}
		span {
			// margin-left: 30rpx;
		}

		&:last-child {
			border-top: 0;
		}
	}
}
.footer {
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
	padding-top: 480rpx;
	padding-bottom: 100rpx;
	.foot-text {
		margin-bottom: 20rpx;
		span {
			color: #0195ff;
		}
	}
}
</style>
